<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>ADMIN</title>
    <%@include file="common.jsp" %>
	<style>body{padding-top: 60px;}</style>
	<link href="../css/login-register.css" rel="stylesheet" />
	<script src="../js/login-register.js" type="text/javascript"></script>
<title>login</title>
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-sm-4"></div>
            <div class="col-sm-4">
                 <a class="btn big-login" data-toggle="modal" href="javascript:void(0)" onclick="openLoginModal();">Log in</a>
                 <a class="btn big-register" data-toggle="modal" href="javascript:void(0)" onclick="openRegisterModal();">Register</a></div>
            <div class="col-sm-4"></div>
        </div>
       
         
		 <div class="modal fade login" id="loginModal">
		      <div class="modal-dialog login animated">
    		      <div class="modal-content">
    		         <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title"></h4>
                    </div>
                    <div class="modal-body">  
                        <div class="box">
                             <div class="content">
                                <div class="social">
                                    <a class="circle github" href="/auth/github">
                                        <i class="fa fa-github fa-fw"></i>
                                    </a>
                                    <a id="google_login" class="circle google" href="/auth/google_oauth2">
                                        <i class="fa fa-google-plus fa-fw"></i>
                                    </a>
                                    <a id="facebook_login" class="circle facebook" href="/auth/facebook">
                                        <i class="fa fa-facebook fa-fw"></i>
                                    </a>
                                </div>
                                <div class="division">
                                    <div class="line l"></div>
                                      <span>or</span>
                                    <div class="line r"></div>
                                </div>
                                <div class="error"></div>
                                <div class="form loginBox">
                                    <form method="post" action="/login" accept-charset="UTF-8">
                                    <input id="userid" class="form-control" type="text" placeholder="用户名" name="email">
                                    <input id="password" class="form-control" type="password" placeholder="密码" name="password">
                                    <input class="btn btn-default btn-login" type="button" value="登录" onclick="loginAjax()">
                                    </form>
                                </div>
                             </div>
                        </div>
                        <div class="box">
                            <div class="content registerBox" style="display:none;">
                             <div class="form">
                                <form method="post" html="{:multipart=>true}" data-remote="true" action="/register" accept-charset="UTF-8">
                                <input id="email" class="form-control" type="text" placeholder="用户名" name="email">
                                <input id="password" class="form-control" type="password" placeholder="密码" name="password">
                                <input id="password_confirmation" class="form-control" type="password" placeholder="确认密码" name="password_confirmation">
                                <input class="btn btn-default btn-register" type="submit" value="创建用户" name="commit">
                                </form>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <div class="forgot login-footer">
                            <span>Looking to 
                                 <a href="javascript: showRegisterForm();">create an account</a>
                            ?</span>
                        </div>
                        <div class="forgot register-footer" style="display:none">
                             <span>Already have an account?</span>
                             <a href="javascript: showLoginForm();">Login</a>
                        </div>
                    </div>        
    		      </div>
		      </div>
		  </div>
    </div>
</body>
<script type="text/javascript">
    function loginAjax(){
    	var userid = $("#userid").val();
        var password = $("#password").val();
        if(userid==""){
        	shakeModal("用户名不允许为空");
        	return false;
        }
		if(password==""){
			shakeModal("密码不允许为空");
			return false;
        }
        if (userid != null && userid != '' && password != null && password != '') {
            $.ajax({
                url:"login",
                type:"post",
                data:"userid="+userid+"&password="+password,
                success:function (result) {
                    result = result.trim();
                    if(result=='success'){
                        window.location.href="../task/?menuType=3";
                    }else if(result=='adminSuccess'){
                        window.location.href="../task/?menuType=3";
                    }else{
                    	shakeModal(result); 
                    }
                },
                error:function (result) {
                	shakeModal(); 
                }
            });
        }
    }
</script>
</html>